<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>interface</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	
	
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	
	
	
    <link href='https://fonts.googleapis.com/css?family=Titillium+Web:400,200,300,700,600' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300' rel='stylesheet' type='text/css'>
    <link href='https://fonts.googleapis.com/css?family=Raleway:400,100' rel='stylesheet' type='text/css'>
    
    <!-- Bootstrap -->
    <link rel="stylesheet" href="PAGE/css/bootstrap.min.css">
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="PAGE/css/font-awesome.min.css">
    
    <!-- Custom CSS -->
    <link rel="stylesheet" href="PAGE/css/owl.carousel.css">
    <link rel="stylesheet" href="PAGE/style.css">
    <link rel="stylesheet" href="PAGE/css/responsive.css">

  </head>
  
  <body>
     <div class="header-area">
        <div class="container">
            <div class="row">
                <div class="col-md-8">
                    <div class="user-menu">
                        <ul>
                            <li><a href="UserAndOrder/userDetail.jsp"><i class="fa fa-user"></i> 我的账户</a></li>
                          <!--   <li><a href="#"><i class="fa fa-heart"></i>心愿单</a></li> -->
                            <li><a href="AddCartServlet?id=0"><i class="fa fa-user"></i>购物车</a></li>
                            <li><a href="OrderServlet?type=0"><i class="fa fa-user"></i> 订单信息</a></li>
                            
                            
                            <c:choose>
                            	<c:when test="${sessionScope.user.usersId eq null}">
                            	<li><a href="UserAndOrder/login.jsp"><i class="fa fa-user">用户登录</i>
                            	
                            	</c:when>
                            	<c:otherwise>
                            	
                            	<li><a href="UserAndOrder/userDetail.jsp"><i class="fa fa-user">${sessionScope.user.usersNickname}</i>
                            	
                            	</c:otherwise>
                            </c:choose>
                            <li><a href="LandWriteOffServlet"><i class="fa fa-user"></i> 注销登录</a></li>
                        </ul>
                    </div>
                </div>
                
                <div class="col-md-4">
                    <div class="header-right">
                        <ul class="list-unstyled list-inline">
                            <li class="dropdown dropdown-small">
                                <a data-toggle="dropdown" data-hover="dropdown" class="dropdown-toggle" href="#"><span class="key">货币 :</span><span class="value">人民币 </span><b class="caret"></b></a>

                            </li>

                            <li class="dropdown dropdown-small">
                                <a data-toggle="dropdown" data-hover="dropdown" class="dropdown-toggle" href="#"><span class="key">语言:</span><span class="value">简体中文</span><b class="caret"></b></a>
                                <ul class="dropdown-menu">

                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- End header area -->
    
  
                    <div class="logo">
                        <div style="text-align: center;">
                            <form action="UserSearchServlet" method="post">
                            	<a href="PAGE/InterFace.jsp"><img src="PAGE/img/logo.png"   ></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                      			 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                      			 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                      			
                      			 <font style="font-style:微软雅黑;" size="5" color="#0C89CF">搜 索 商 品    </font>
                       			<input type="text" name="usersearch" placeholder="请输入搜索内容">
                                <input type="submit" value="搜索">
                            </form>  
                        </div>
                    </div>
                    
<!-- End site branding area -->
    
    <div class="mainmenu-area">
        <div class="container">
            <div class="row">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                </div> 
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="/eshop/PAGE/InterFace.jsp"">主页</a></li>
                        <li><a href="UserSearchServlet">商品页面</a></li>
                        <li><a href="ProductDetailsServlet?id=0">商品详情</a></li>
                        <li><a href="AddCartServlet?id=0">购物车</a></li>
                        <li><a href="OrderServlet?type=0">您的宝贝</a></li>
                        <li><a href="EvaluateServlet?type=showEvaluate">留言板</a></li>
                        <%--
                        <li><a href="#">Category</a></li>
                        <li><a href="#">Others</a></li>
                        <li><a href="#">Contact</a></li>

                --%></div>  
            </div>
        </div>
    </div> <!-- End mainmenu area -->
    
    <div class="slider-area">

        	<!-- Slider -->
			<div class="block-slider block-slider4">
				<ul class="" id="bxslider-home4">
					<li><img src="PAGE/img/h4-slide3.png" alt="Slide">
						<div class="caption-group" align="center">
							<h2 class="caption title">
								轻奢 <span class="primary">至臻 <strong>至诚</strong></span>
							</h2>
							<h4 class="caption subtitle" align="center">新品上架</h4>
							<a class="caption button-radius" href="ProductDetailsServlet?id=9"><span class="icon"></span>点击进入</a>
						</div>
					</li>
					<li>
						<img src="PAGE/img/h4-slide.png" alt="Slide" height="10%" width="10%">
						<div class="caption-group" align="center">
							<h2 class="caption title">
								HUAQWEI <span class="primary">P <strong>10</strong></span>
							</h2>
							<h4 class="caption subtitle" align="center">钻雕蓝,彰显贵族气质</h4>
							<a class="caption button-radius" href="ProductDetailsServlet?id=1"><span class="icon"></span>点击进入</a>
						</div> 
					</li>

					<li><img src="PAGE/img/h4-slide2.png" alt="Slide">
						<div class="caption-group" align="center">
							<h2 class="caption title">
								内 置 GPS <span class="primary">火热 <strong>畅销</strong></span>
							</h2>
							<h4 class="caption subtitle" align="center">瞬息之美，尽在掌握</h4>
							<a class="caption button-radius" href="ProductDetailsServlet?id=20"><span class="icon"></span>点击进入</a>
						</div>
					</li>

		
				</ul>
			</div>
			<!-- ./Slider -->
    </div> <!-- End slider area -->
    
    <div class="promo-area">
        <div class="zigzag-bottom"></div>
        <div class="container">
            <div class="row">
                <div class="col-md-3 col-sm-6">
                    <div class="single-promo promo1">
                        <i class="fa fa-refresh"></i>
                        <p>30 天 包 换</p>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="single-promo promo2">
                        <i class="fa fa-truck"></i>
                        <p>免 费 物 流</p>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="single-promo promo3">
                        <i class="fa fa-lock"></i>
                        <p>安 全 支 付</p>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="single-promo promo4">
                        <i class="fa fa-gift"></i>
                        <p>新 品 上 架</p>
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- End promo area -->
    
    <div class="maincontent-area">
        <div class="zigzag-bottom"></div>
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="latest-product">
                        <h2 class="section-title">H O T </h2>
                        <div class="product-carousel">
                            <div class="single-product">
                            
                            
                                <div class="product-f-image" style="height: 300px">
                                    <img src="PAGE/img/product-1.jpg" alt="" >
                                    <div class="product-hover">
                                        <a href="AddCartServlet?id=2" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i>添加至购物车</a>
                                        <a href="ProductDetailsServlet?id=2" class="view-details-link"><i class="fa fa-link"></i> 查看详情</a>
                                    </div>
                                </div>
                                
                                <h2><a href="single-product.html">华为 M9</a></h2>
                                
                                <div class="product-carousel-price">
                                    <ins>￥2333</ins> <del>￥2599</del>
                                </div> 
                            </div>
                            
                            
                            
                            <div class="single-product">
                                <div class="product-f-image" style="height: 300px">
                                    <img src="PAGE/img/product-2.jpg" alt="">
                                    <div class="product-hover">
                                        <a href="AddCartServlet?id=8" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i>添加至购物车</a>
                                        <a href="ProductDetailsServlet?id=8" class="view-details-link"><i class="fa fa-link"></i> 查看详情</a>
                                    </div>
                                </div>
                                
                                <h2>魅族pro6 plus</h2>
                                <div class="product-carousel-price">
                                    <ins>￥2333</ins> <del>￥2699</del>
                                </div> 
                            </div>
                            
                            
                            
                            <div class="single-product">
                                <div class="product-f-image" style="height: 300px">
                                    <img src="PAGE/img/product-3.jpg" alt="">
                                    <div class="product-hover">
                                        <a href="AddCartServlet?id=23" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i>添加至购物车</a>
                                        <a href="ProductDetailsServlet?id=23" class="view-details-link"><i class="fa fa-link"></i> 查看详情</a>
                                    </div>
                                </div>
                                
                                <h2>索尼A6500</h2>

                                <div class="product-carousel-price">
                                    <ins>￥11298</ins> <del>￥11300</del>
                                </div>                                 
                            </div>
                            <div class="single-product">
                                <div class="product-f-image" style="height: 300px">
                                    <img src="PAGE/img/product-4.jpg" alt="">
                                    <div class="product-hover">
                                        <a href="AddCartServlet?id=22" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i>添加至购物车</a>
                                        <a href="ProductDetailsServlet?id=22" class="view-details-link"><i class="fa fa-link"></i> 查看详情</a>
                                    </div>
                                </div>
                                
                                <h2><a href="single-product.html">索尼A7R2</a></h2>

                                <div class="product-carousel-price">
                                    <ins>￥20399</ins> <del>￥21099</del>
                                </div>                            
                            </div>
                            <div class="single-product">
                                <div class="product-f-image" style="height: 300px">
                                    <img src="PAGE/img/product-5.jpg" alt="">
                                    <div class="product-hover">
                                        <a href="AddCartServlet?id=12" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i>添加至购物车</a>
                                        <a href="ProductDetailsServlet?id=12" class="view-details-link"><i class="fa fa-link"></i> 查看详情</a>
                                    </div>
                                </div>
                                
                                <h2>惠普  15-AX016TX</h2>

                                <div class="product-carousel-price">
                                    <ins>￥4200.00</ins> <del>￥4500</del>
                                </div>                                 
                            </div>
                            <div class="single-product">
                                <div class="product-f-image" style="height: 300px">
                                    <img src="PAGE/img/product-6.jpg" alt="">
                                    <div class="product-hover">
                                        <a href="AddCartServlet?id=16" class="add-to-cart-link"><i class="fa fa-shopping-cart"></i>添加至购物车</a>
                                        <a href="ProductDetailsServlet?id=16" class="view-details-link"><i class="fa fa-link"></i> 查看详情</a>
                                    </div>
                                </div>
                                
                                <h2><a href="single-product.html">戴尔灵越15 5000</a></h2>

                                <div class="product-carousel-price">
                                   <ins>￥5200.00</ins> <del>$5355.00</del>
                                </div>                            
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- End main content area -->
    
    
    
    
    
    
    <!--
   
   logo以上
    -->
    
    
    
    
    
    
    <div class="brands-area">
        <div class="zigzag-bottom"></div>
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="brand-wrapper">
                        <div class="brand-list">
                            <img src="PAGE/img/brand1.png" alt="">
                            <img src="PAGE/img/brand2.png" alt="">
                            <img src="PAGE/img/brand3.png" alt="">
                            <img src="PAGE/img/brand4.png" alt="">
                            <img src="PAGE/img/brand5.png" alt="">
                            <img src="PAGE/img/brand6.png" alt="">
                            <img src="PAGE/img/brand1.png" alt="">
                            <img src="PAGE/img/brand2.png" alt="">                            
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- End brands area -->
    
    
    
    
    
    
    
    
    
    <div class="product-widget-area">
        <div class="zigzag-bottom"></div>
        <div class="container">
            <div class="row">
                <div class="col-md-4">
                    <div class="single-product-widget">
                        <h2 class="product-wid-title">畅 销 商 品</h2>
                        <a href="UserSearchServlet?usersearch=7" class="wid-view-more">查 看 全 部</a>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=6"><img src="PAGE/img/product-thumb-1.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=6">魅族 MAX 4 - 2015</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥1399</ins> <del>￥1599</del>
                            </div>                            
                        </div>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=3"><img src="PAGE/img/product-thumb-2.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=3">小米MAX 2015</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥3299</ins> <del>￥3599</del>
                            </div>                            
                        </div>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=12"><img src="PAGE/img/product-thumb-3.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=12">惠普 AK030TX</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥5800</ins> <del>￥6300</del>
                            </div>                            
                        </div>
                    </div>
                </div>
                
                
                
                
                <div class="col-md-4">
                    <div class="single-product-widget">
                        <h2 class="product-wid-title">相 关 推 荐</h2>
                        <a href="UserSearchServlet?usersearch=7" class="wid-view-more">查看全部</a>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=21"><img src="PAGE/img/product-thumb-4.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=21">Nikon S700</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
         
                            <div class="product-wid-price">
                                <ins>￥4000</ins> <del>￥4250</del>
                            </div>                            
                        </div>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=17"><img src="PAGE/img/product-thumb-a.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=17">PowerShot G1 X Mark II</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥13990</ins> <del>￥15000</del>
                            </div>                            
                        </div>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=20"><img src="PAGE/img/product-thumb-b.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=20">尼康P900S </a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥3299</ins> <del>￥3500</del>
                            </div>                            
                        </div>
                    </div>
                </div>
                
                
                
                
                <div class="col-md-4">
                    <div class="single-product-widget">
                        <h2 class="product-wid-title">最 新推 荐</h2>
                        <a href="UserSearchServlet?usersearch=7" class="wid-view-more">查看全部</a>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=10"><img src="PAGE/img/product-thumb-c.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=10">联想700S</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥4999</ins> <del>￥5399</del>
                            </div>                            
                        </div>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=15	"><img src="PAGE/img/product-thumb-d.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=15">戴尔燃700</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥5888</ins> <del>￥6300</del>
                            </div>                            
                        </div>
                        <div class="single-wid-product">
                            <a href="ProductDetailsServlet?id=4"><img src="PAGE/img/product-thumb-e.jpg" alt="" class="product-thumb"></a>
                            <h2><a href="ProductDetailsServlet?id=4">红米4</a></h2>
                            <div class="product-wid-rating">
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                                <i class="fa fa-star"></i>
                            </div>
                            <div class="product-wid-price">
                                <ins>￥2333</ins> <del>￥2699</del>
                            </div>                            
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> <!-- End product widget area -->
    

   
    <!-- Latest jQuery form server -->
    <script src="https://code.jquery.com/jquery.min.js"></script>
    
    <!-- Bootstrap JS form CDN -->
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    
    <!-- jQuery sticky menu -->
    <script src="PAGE/js/owl.carousel.min.js"></script>
    <script src="PAGE/js/jquery.sticky.js"></script>
    
    <!-- jQuery easing -->
    <script src="PAGE/js/jquery.easing.1.3.min.js"></script>
    
    <!-- Main Script -->
    <script src="PAGE/js/main.js"></script>
    
    <!-- Slider -->
    <script type="text/javascript" src="PAGE/js/bxslider.min.js"></script>
	<script type="text/javascript" src="PAGE/js/script.slider.js"></script>
  </body>
</html>
